<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Insert title here</title>

<link href="../bootstrap/bootstrap.min.css" rel="stylesheet">
<style type="text/css">
html {
	padding: 10px 20px 10px 20px;
}
</style>
</head>
<body>
	<form>
		<div class="form-row">
			<div class="form-group col-md-5" style="padding-left:0px;">
				<label for="title">文章标题</label> 
				<input type="text" class="form-control" id="title">
			</div>
				
			<div class="form-group col-md-3">
				<label for="category">文章分类</label> 
				<select id="category" class="form-control">
					<option selected>请选中分类：</option>
					<option>java</option>
					<option>c++</option>
				</select>
			</div>

			<div class="form-group col-md-3">
				<label for="created">创建时间</label> 
				<input type="text" class="form-control" id="created">
			</div>
			
			<div class="form-group col-md-1">
				<label>&nbsp;</label> 
				<button type="submit" id="btnSearch" class="form-control btn btn-primary">搜索</button>
			</div>
		</div>
		
		<div class="form-row" style="margin-bottom:10px;">
			<div class="btn-group btn-group-sm" role="group">
				<button type="button" class="btn btn-primary">添加文章</button>
				<button type="button" class="btn btn-primary">批量删除</button>
			</div>
		</div>
		
		<table class="table table-bordered table-striped table-hover"> 
			<thead>
				<tr>
					<th scope="col"></th>
					<th scope="col">#</th>
					<th scope="col">标题</th>
					<th scope="col">创建时间</th>
					<th scope="col">分类</th>
					<th scope="col">操作</th>
				</tr>
			</thead>
			<tbody>
			<c:forEach var="post" items="${posts}">	
				<tr>
					<td><input class="form-check-input" type="checkbox" name="ids"></td>
					<th scope="row">${post.id }</th>
					<td>${post.title }</td>
					<td>${post.created }</td>
					<td></td>
					<td>
						<a href="#">修改</a>
						&nbsp;&nbsp;
						<a href="#">删除</a>
					</td>
				</tr>
			</c:forEach>
			</tbody>
		</table>
	</form>

	<script src="../js/jquery.min.js"></script>
	<script src="../bootstrap/bootstrap.min.js"></script>
</body>
</html>